<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script src="js/jquery-3.1.1.min.js" ></script>
<script type="text/javascript">
	$(function(){
		var par = $("#parselect").val();
			$.ajax({
				type:"get",
				url:"doselect.jsp",
				data:{"id":"0"},
				async:true,
				dataType:"json",
				success:function(a){
				/* 	var list=eval(a);
					var trlist="<option>---请选择---</option>";
					for(var i=0;i<list.length;i++){
						trlist+="<option value='"+list[i]["dataTypeId"]+"'>";
						trlist+=list[i]["dataTypeName"];
						trlist+="</option>";
					}
				  $("#parselect").html(trlist); */
					var list = eval(a);
					$("#parselect")
						for (var i = 0 ; i < list.length ; i++) {
							$("#parselect").append(new Option(list[i]['dataTypeName'], list[i]['dataTypeId']), null);
						} 
				},
				error:function(){
					alert("发生异常-父");
				},
				
			});
			$("#parselect").bind("change",function(){
				var par = $("#parselect").val();
		$.ajax({
			type:"get",
			url:"doselect.jsp?id="+par,
			async:true,
			dataType:"json",
			success:function(a){
				var list = eval(a);
				var sel = $("#childselect");
				sel.empty();
				sel.append(new Option("--请选择--"),null)
					for (var i = 0 ; i < list.length ; i++) {
						sel.append(new Option(list[i]['dataTypeName'], list[i]['dataTypeId']), null);
					}
			},
			error:function(){
				alert("发生异常--子");
			},
		});
			});
	});
	
		function find() {
			
		} 
</script>
</head>
<body>
 父类<select id="parselect">
  <option value="0">--请选择--</option>
 </select>
 子类<select id="childselect">
 <option>--请选择--</option>
 </select>
 <input type="button" value="查询" onclick="find()"/>
</body>
</html>